<template>
	<view class="page index">
		<view class="header">
			<nav-bar title="成就勋章"></nav-bar>
		</view>
		<view class="main">
			<view class="rate-progress">
				<view class="reat">
					<text>勋章获得进度：</text>
					<text>4/12</text>
				</view>
				<view class="decoration">
					<text>前往佩戴</text>
				</view>
			</view>
			<view class="">
				<Medal v-for="(item,index) in medalList" :key="item.id" :obj="item" :index="index" />
			</view>
		</view>
	</view>
</template>

<script>
	import Medal from "./Medal/index.vue"
	export default {
		components: {
			Medal,
		},
		data() {
			return {
				medalList: [{
						id: 0,
						medal: '忠诚',
					},
					{
						id: 1,
						medal: '阳光',
					},
					{
						id: 2,
						medal: '美丽',
					},
					{
						id: 3,
						medal: '和顺',
					}
				]
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import "@/common/style/common.scss";
	@import "index.scss";
</style>